<template>
  <div class="feed">
    <div class="feed__main">
      <ArticalSpecial />
      <Comment class="feed__main__comment" :buttonTop="5"
        ><template v-slot:header
          ><div class="feed__main__comment__title">
            说说你的看法
          </div>
        </template>
      </Comment>
    </div>
    <div>
      <Attachment />
    </div>
  </div>
</template>

<script>
import Comment from "../../components/Comment";
import AllComment from "../components/AllComment";
import ArticalSpecial from "../components/ArticalSpecial.vue";
import Attachment from "../components/Attachment";
export default {
  name: "feed",
  data() {
    return {};
  },
  components: {
    Comment,
    AllComment,
    ArticalSpecial,
    Attachment
  }
};
</script>

<style lang="scss" scoped>
.feed {
  display: flex;
  justify-content: center;
  .feed__main {
    width: 800px;
    margin-right: 24px;
    background: $color-background;
    padding: 32px;
    &__comment {
      margin-top: 48px;
      &__title {
        font-size: 18px;
        font-weight: 500;
        height: 26px;
        line-height: 26px;
      }
    }
    &__all-comment {
      margin-top: 50px;
    }
  }
}
</style>
